import 'package:flutter/material.dart';
import 'package:xinxuan/common/appbar_util.dart';
import 'package:xinxuan/common/dialogs/unbound_dialog.dart';
import 'package:xinxuan/common/info_item.dart';
import 'package:xinxuan/common/scroll_configuration_common.dart';
import 'package:xinxuan/controllers/my_controller/pay_bank_controller/pay_bank_detail_page_controller.dart';
import 'package:xinxuan/router/app_routers.dart';
import 'package:xinxuan/utils/bank_code_util.dart';
import 'package:xinxuan/utils/color_util.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:xinxuan/vo/common_vo/common_bank_card_item_vo.dart';

class PayBankDetailPage extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    Map<String, dynamic> argumentsMap = Get.arguments;
    CommonBankCardItemVo payBankItem = argumentsMap['payBankItem'];
    return Scaffold(
      backgroundColor: pageBgColor,
      appBar: AppBarUtil(
        title: '解绑银行卡',
        backgroundColor: pageBgColor,
      ),
      body: GetBuilder<PayBankDetailPageController>(
        init: PayBankDetailPageController(),
        builder: (controller) {
          return ScrollConfigurationCommon(child: ListView(
            children: [
              _bankItem(
                bankName: '${payBankItem.bank!.title}', 
                cardNumber: '${payBankItem.cardNumber}', 
                code: '${payBankItem.bank!.code}', 
                lastNumber: '${payBankItem.mobile!.substring(7)}'
              ),
              InfoItem(
                title: '修改支付密码', 
                child: Container(), 
                onTap: () {
                  Get.toNamed('${AppRouters.COMMON_PAGE}${AppRouters.MY_INFO_PAGE}${AppRouters.UPDATE_PAY_PASSWORD_PAGE}');
                }
              ),
              InfoItem(
                title: '解绑银行卡', 
                child: Container(), 
                showBorder: false,
                onTap: () {
                  Get.dialog(UnboundDialog(paymentId: payBankItem.id!));
                }
              ),
            ],
          ));
        },
      ),
    );
  }

  /// 银行卡
  Widget _bankItem({ required String bankName, required String cardNumber, required String code, required String lastNumber }) {
    return Stack(
      children: [
        Container(
          height: 113.h,
          width: 375.w,
          padding: EdgeInsets.all(16.w),
          decoration: BoxDecoration(
            gradient: LinearGradient(
              colors: [
                bgBank1,
                bgBank2,
              ]
            )
          ),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  Row(
                    children: [
                      Container(
                        width: 30.w,
                        height: 30.w,
                        alignment: Alignment.center,
                        decoration: BoxDecoration(
                          borderRadius: BorderRadius.circular(30.w),
                          color: bgWhiteColor
                        ),
                        child: Image.asset(
                          BankCodeUtil.getBankLogo(code),
                          width: 18.w,
                          height: 18.w,
                          fit: BoxFit.cover,
                        ),
                      ),
                      SizedBox(width: 10.w),
                      Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Text(
                            bankName,
                            style: TextStyle(
                              color: textWhiteColor,
                              fontSize: 16.sp
                            ),
                          ),
                          Opacity(
                            opacity: .7,
                            child: Text(
                              '储蓄卡',
                              style: TextStyle(
                                color: textWhiteColor,
                                fontSize: 12.sp
                              ),
                            ),
                          )
                        ],
                      ),
                    ],
                  ),
                  Text(
                    '手机尾号 $lastNumber',
                    style: TextStyle(
                      color: textWhiteColor,
                      fontSize: 12.sp
                    ),
                  )
                ],
              ),
              Row(
                children: [
                  SizedBox(width: 40.w),
                  Column(
                    children: [
                      Text(
                        cardNumber,
                        style: TextStyle(
                          color: textWhiteColor,
                          fontSize: 19.sp
                        ),
                      ),
                      SizedBox(height: 4.w)
                    ],
                  )
                ],
              )
            ],
          ),
        ),
        Positioned(
          top: 35.h,
          right: 19.w,
          child: Image.asset(
            'assets/icons/icon_bank_unionPay.png',
            width: 105.w,
            height: 43.h,
          )
        )
      ],
    );
  }
}